﻿@{
    ViewData["Title"] = "用户列表";
}
<div class="layui-layout layui-layout-admin">
    <form class="layui-form" action="" lay-filter="val-filter">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">帐号名称</label>
                <div class="layui-input-inline">
                    <input type="hidden" name="id" value="0" />
                    <input type="hidden" name="orgId" id="orgId" value="0" />
                    <input type="text" name="account" lay-verify="required" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">昵称</label>
                <div class="layui-input-inline">
                    <input type="text" name="nickName" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-inline">
                    <input type="text" name="phone" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">真实姓名</label>
                <div class="layui-input-inline">
                    <input type="text" name="realName" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">角色</label>
                <div class="layui-input-inline">
                    <select name="roleIdList" id="roleIdList"></select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">帐号类型</label>
                <div class="layui-input-inline">
                    <select name="accountType">
                        <option value="888">普通用户</option>
                        <option value="999">超级管理员</option>9
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">邮箱</label>
                <div class="layui-input-inline">
                    <input type="text" name="email" lay-verify="email" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">排序</label>
                <div class="layui-input-inline">
                    <input type="number" value="100" lay-affix="number" name="orderNo" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">所属机构</label>
                <div class="layui-input-inline">
                    <input type="text" name="org" id="org" lay-filter="org" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">职务</label>
                <div class="layui-input-inline">
                    <select name="posId" id="posId"></select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea name="remark" class="layui-textarea"></textarea>
            </div>
        </div>

    </form>
</div>

@section scripts {
    <script type="text/javascript">
        var app = {};
        layui.use(['http', 'treeSelect', 'toast'], function () {
            var $ = layui.$,
                form = layui.form,
                treeSelect = layui.treeSelect,
                toast = layui.toast,
                http = layui.http;
            //
            app.save = function () {
                form.submit('val-filter', function (data) {
                    var postData = data.field;
                    postData.roleIdList = [postData.roleIdList];
                    //角色列表
                    var url = postData.id == '0' ? '/api/sysUser/add' : '/api/sysUser/update'
                    http.post(url, postData).then((res) => {
                        if (res.code == 200) {
                            parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
                            parent.layui.table.reload('lsttable');
                            toast.success({ message: '保存成功！' });
                        }
                        else {
                            layer.alert('保存失败，错误信息:' + res.message, { icon: 2 });
                        }
                    });
                    return false;
                });
            }
            //
            app.init = function () {
                var data = app.data || {};
                form.val('val-filter', data);
                //角色列表
                http.get('/api/sysRole/list').then((res) => {
                    res.result.forEach(function (item) {
                        var selected = data.roleName != undefined && item.name == data.roleName ? 'selected' : '';
                        $('#roleIdList').append('<option ' + selected + ' value=' + item.id + '>' + item.name + '</option>')
                    });
                    form.render('select');
                })
                //职务列表
                http.get('/api/sysPos/list').then((res) => {
                    res.result.forEach(function (item) {
                        var selected = data.posName != undefined && item.name == data.posName ? 'selected' : '';
                        $('#posId').append('<option ' + selected + ' value=' + item.id + '>' + item.name + '</option>')
                    });
                    form.render('select');
                })
                treeSelect.render({
                    // 选择器
                    elem: '#org',
                    // 数据
                    data: '/api/sysOrg/list?Id=0',
                    // 请求头
                    headers: {
                        Authorization: http.getToken()
                    },
                    // 加载完成后的回调函数
                    success: function (d) {
                        // 选中节点，根据id筛选
                        if ($('#orgId').val() != '0') treeSelect.checkNode('org', $('#orgId').val());
                    },
                    click: function (d) {
                        $('#orgId').val(d.current.id);
                    }
                });
            }();
        })
    </script>
}
